/* 主题颜色变量 */
$primary-color: #ff4d4f; // 快逛商城主色调，活力红色
$success-color: #52c41a;
$warning-color: #faad14;
$error-color: #ff4d4f;
$text-primary: #1f1f1f;
$text-secondary: #666666;
$text-light: #999999;
$bg-color: #f7f7f7;
$card-bg: #ffffff;
$border-color: #eeeeee;

/* 通用样式类 */
.page-container {
    width: 95%;
    margin: 0 auto;
    padding: 20rpx 0;
}

.card {
    background: $card-bg;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    margin-top: 20rpx;
}

.card-header {
    padding: 30rpx;
    border-bottom: 1px solid $border-color;
}

.card-body {
    padding: 30rpx;
}

.form-item {
    margin-bottom: 30rpx;
}

.btn {
    border-radius: 12px;
    font-weight: 500;
    letter-spacing: 1px;
    transition: all 0.3s ease;
}

.btn-primary {
    background: linear-gradient(135deg, $primary-color 0%, darken($primary-color, 10%) 100%);
    color: white;
}

.btn-warning {
    background: linear-gradient(135deg, $warning-color 0%, darken($warning-color, 10%) 100%);
    color: white;
}

/* 列表样式 */
.list-item {
    padding: 30rpx;
    border-bottom: 1px solid $border-color;
    transition: all 0.3s ease;
    
    &:last-child {
        border-bottom: none;
    }
    
    &:active {
        background-color: rgba($primary-color, 0.05);
    }
}

/* 搜索框样式 */
.search-box {
    background-color: rgba($primary-color, 0.05);
    border-radius: 12px;
    padding: 20rpx;
}

/* 头像样式 */
.avatar {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* 模态框样式 */
.modal {
    border-radius: 16px;
    overflow: hidden;
    
    &__header {
        padding: 30rpx;
        border-bottom: 1px solid $border-color;
    }
    
    &__body {
        padding: 30rpx;
    }
    
    &__footer {
        padding: 20rpx 30rpx;
        border-top: 1px solid $border-color;
    }
}

/* 加载更多样式 */
.load-more {
    padding: 30rpx 0;
    text-align: center;
    color: $text-light;
}

/* 防伪码查询特定样式 */
.validate-result {
    text-align: center;
    padding: 40rpx;
    
    &.success {
        color: $success-color;
    }
    
    &.error {
        color: $error-color;
    }
    
    .icon {
        font-size: 80rpx;
        margin-bottom: 20rpx;
    }
    
    .message {
        font-size: 32rpx;
        font-weight: 600;
    }
}

/* 商品信息样式 */
.product-info {
    padding: 30rpx;
    
    .product-name {
        font-size: 32rpx;
        font-weight: 600;
        color: $text-primary;
        margin-bottom: 16rpx;
    }
    
    .product-desc {
        font-size: 28rpx;
        color: $text-secondary;
        line-height: 1.6;
    }
}

/* 响应式布局 */
@media screen and (min-width: 768px) {
    .page-container {
        max-width: 1200px;
    }
} 